import React,{Component} from 'react';
import {connect} from 'react-redux';
import {changeAuth} from './../action/auth';
import {Link,hashHistory,withRouter} from 'react-router';

class HomeContext extends Component{
    
    render(){
        console.log(this.props)
        const AuthButton = withRouter(({ history }) => (
            this.props.auth.fakeAuth.isAuthenticated ? (
                <div>
                    <p style={{fontSize:'30px'}}>
                        欢&nbsp;迎&nbsp;来&nbsp;到&nbsp;CoCo&nbsp;&nbsp;Shop!
                    </p>
                    <p>这&nbsp;是&nbsp;一&nbsp;个&nbsp;集&nbsp;购&nbsp;物&nbsp;新&nbsp;闻&nbsp;于&nbsp;一&nbsp;体&nbsp;的&nbsp;商&nbsp;城<br/>
                        ok&nbsp;,please&nbsp;&nbsp;enjoy&nbsp;&nbsp;it!
                    </p>
                    <Link to='/product'><div className="btn btn-success btn-lg" role="button">Start Shopping!</div></Link>
                    {/* <button onClick={() => {this.props.auth.fakeAuth.signout(() => history.push('/'))
                    }}>Sign out</button> */}
                </div>
            ) : (
                <div>
                    <p style={{fontSize:'25px'}}>
                        您&nbsp;&nbsp;还&nbsp;&nbsp;没&nbsp;&nbsp;有&nbsp;&nbsp;
                        <button className="btn btn-primary" onClick={() => {hashHistory.push('/login')}}>登&nbsp;&nbsp;录</button>
                    </p>
                    <p style={{fontSize:'25px'}}>
                        还&nbsp;&nbsp;没&nbsp;&nbsp;有&nbsp;&nbsp;账&nbsp;&nbsp;号 ？去
                        <button className="btn btn-primary" onClick={() => {hashHistory.push('/register')}}>注&nbsp;&nbsp;册</button>
                    </p>
                    <p>这&nbsp;是&nbsp;一&nbsp;个&nbsp;集&nbsp;购&nbsp;物&nbsp;新&nbsp;闻&nbsp;于&nbsp;一&nbsp;体&nbsp;的&nbsp;商&nbsp;城<br/>
                        ok&nbsp;&nbsp;,&nbsp;&nbsp;please&nbsp;&nbsp;enjoy&nbsp;&nbsp;it!
                    </p>
                </div>
            )
        ))
        return (
            <div>
                <div className="jumbotron">
                    <div className="container">
                        <AuthButton/>
                    </div>
                </div>
            </div>
        )
    }
}



const getValue = (state)=>{
    console.log(state)
    return {
        auth:state.auth
    }
}

const Home = connect(getValue , {})(HomeContext);

export default Home;